<template>
  <view class="bg-white">
    <cu-custom
      bgColor="bg-white"
      :isBack="true"
    >
      <block slot="content">{{isEdit==1 ? '待入职编辑' : '待入职新增'}}</block>
    </cu-custom>
    <view style="padding: 10px;margin-top: 10px;">
      <view
        class="action"
        style="margin-bottom: 10px;"
      >
        <text
          class="cuIcon-titles "
          style="color: #1E5EFF;"
        ></text>
        <text style="color: #5A607F;font-size: 30rpx;">
          基础信息新增
        </text>
      </view>
      <view style="padding: 10px;" v-if="isReloadPartData">
		  <view v-if="dataObj.identityCategory == 3 || dataObj.identityCategory == 5" style="background-color: #fff1f0;border: 1px solid #ffa39e;padding: 8px 15px 8px 37px; word-wrap: break-word;border-radius: 4px;">该用户在黑名单中，请慎重录取</view>
        <!-- <view
					style="width: 100px;height: 97px;text-align: center;background-color: rgba(245, 246, 250, 1);padding: 10px;font-size: 14px;"
					@click="addImg">
					<view style="margin-top: 15px;">
						<image src="@/static/images/add.png" style="width: 20px;height: 20px;"></image>
					</view>
					<text style="display: inline-block;">
						添加照片
					</text>

				</view> -->

        <!-- <view class="cu-form-group margin-top">
					<view class="title">读证时间</view>
					<picker mode="date" :value="createTime" @change="DateChangeCreateTime">
						<view class="picker">
							{{createTime}}
						</view>
					</picker>
				</view> -->
				
		<view class="cu-form-group">
		  <view class="title">公民身份证号码</view>
		  <input
		    name="input"
		    v-model.trim="dataObj.idCard"
		    :disabled="isEdit==1 ? true : false"
		    @blur="getOtherMessage()"
		  />
		</view>
        <view class="cu-form-group">
          <view class="title">姓名</view>
          <!-- <input  name="input" v-model="dataObj.realname" disable="isEdit == 1 ? true : false" /> -->
          <input
            name="input"
            v-model="dataObj.realname"
            :disabled="isEdit==1 ? true : false"
          />
        </view>

        <view class="cu-form-group">
          <view class="title">性别</view>
          <!-- <my-select  range-key="text" value-key="value" dict-code="sex" v-model="dataObj.sex" :disabled="isEdit==1 ? true : false" /> -->
          <view
            class="cu-form-group"
            style="border-radius: 10px;position: absolute;right: 10rpx;"
          >
            <!-- <view class="title">{{label}}</view> -->
            <picker
              @change="PickerChange"
              value-key="value"
              range-key="text"
              :range="dictOptions"
              :disabled="isEdit==1 ? true : false"
            >
              <view
                class="picker"
                style="color: inherit;float: left;width: 100%;"
              >
                {{ dataObj.sex_dictText || '请选择'}}
              </view>
            </picker>
          </view>
        </view>
        <view class="cu-form-group">
          <view class="title">年龄</view>
          <input
            name="input"
            type="number"
            v-model="dataObj.age"
            :disabled="isEdit==1 ? true : false"
          />
        </view>
        <view class="cu-form-group">
          <view class="title">民族</view>
          <input
            name="input"
            v-model="dataObj.nation"
            :disabled="isEdit==1 ? true : false"
          />
        </view>
        <view class="cu-form-group">
          <view class="title">籍贯</view>
          <input
            name="input"
            v-model="dataObj.nativePlace"
          />
        </view>

        <view class="cu-form-group" v-if="isEdit == 1 ">
          <view class="grid col-4 grid-square flex-sub" v-if="imgList.length && imgList.length >0">
            <view
              class="bg-img"
              v-for="(item,index) in imgList"
              :key="index"
              @tap="ViewImage"
              :data-url="imgList[index]" 
            >
              <image
                :src="imgList[index]"
                mode="aspectFill"
              ></image>
            </view>
			
           <!-- <view v-else
              style="text-align: center;background: #F5F6FA;border-radius:10px;"
            >
              <text class='cuIcon-add'></text>
              <text style="display: inline-block;margin-top: 45px;color: #5A607F;font-size: 12px;font-weight: 500;">
                身份证正反面
              </text>
            
			</view> -->	
          </view>
		    <view class="grid col-4 grid-square flex-sub" v-else>
				<view
				   style="text-align: center;background: #F5F6FA;border-radius:10px;"
				 >
				   <text class='cuIcon-add'></text>
				   <text style="display: inline-block;margin-top: 45px;color: #5A607F;font-size: 12px;font-weight: 500;">
				     身份证正反面
				   </text>
				 
							</view>
			</view>
		 
        </view>
        <view class="cu-form-group" v-else>
          <view class="grid col-4 grid-square flex-sub">
            <view
              class="bg-img"
              v-for="(item,index) in imgList"
              :key="index"
              @tap="ViewImage"
              :data-url="imgList[index]"
            >
              <image
                :src="imgList[index]"
                mode="aspectFill"
              ></image>
              <view
                class="cu-tag bg-red radius"
                @tap.stop="DelImg"
                :data-index="index"
              >
                <text class='cuIcon-close'></text>
              </view>
            </view>
            <view
              @tap="ChooseImage"
              v-if="imgList.length<1"
              style="text-align: center;background: #F5F6FA;border-radius:10px;"
            >
              <text class='cuIcon-add'></text>
              <text style="display: inline-block;margin-top: 45px;color: #5A607F;font-size: 12px;font-weight: 500;">
                身份证正反面
              </text>
            </view>
          </view>
        </view>
       
        <view
          class="cu-form-group"
          style="margin-right: -14px !important;"
        >
          <view class="title">出生日期</view>
          <picker
            mode="date"
            :value="birthday"
            @change="DateChange"
            :disabled="isEdit==1 ? true : false"
          >
            <view class="picker">
              <!-- {{birthday.replaceAll('-','/')}} -->
              {{birthday ? birthday : '请选择'}}
            </view>
          </picker>
        </view>
        <view class="cu-form-group">
          <view class="title">住址</view>
          <input
            name="input"
            v-model="dataObj.idCardAddress"
            :disabled="isEdit==1 ? true : false"
          />
        </view>
        <view class="cu-form-group">
          <view class="title">签发机关</view>
          <input
            name="input"
            v-model="dataObj.idCardIssue"
            :disabled="isEdit==1 ? true : false"
          />
        </view>
        <view
          class="cu-form-group"
          style="margin-right: -14px !important;"
        >
          <view class="title">有效期限</view>
		  <input
		    name="input"
		    v-model="dataObj.idCardValidPeriod"
		    :disabled="isEdit==1 ? true : false"
		  />
        <!--  <picker
            mode="date"
            :value="idCardValidPeriod"
            @change="DateChangeIdCardValidPeriod"
            :disabled="isEdit==1 ? true : false"
          >
            <view class="picker">
              {{idCardValidPeriod ? idCardValidPeriod : '请选择'}}
            </view>
          </picker> -->
        </view>
        <view class="cu-form-group">
          <view class="title">身份类别</view>
          <my-select
            range-key="text"
            value-key="value"
            dict-code="identity_category"
            :disabled="isEdit==1 ? true : false"
            v-model="dataObj.identityCategory"
          />
        </view>
		<view class="cu-form-group" v-if="dataObj.blacklistType">
		  <view class="title">黑名单类型</view>
		  <my-select
		    range-key="text"
		    value-key="value"
		    dict-code="blacklist_type"
		    :disabled="isEdit==1 ? true : false"
		    v-model="dataObj.blacklistType"
		  />
		</view>
        <view class="cu-form-group">
          <view class="title">公司</view>
          <my-select
            range-key="text"
            value-key="value"
            dict-code="crm_company,name,id"
            v-model="dataObj.company"
          />
        </view>
        <view class="cu-form-group">
          <view class="title">地址</view>
          <input
            disabled
            name="input"
            v-model="dataObj.companyAddress"
          />
        </view>
      </view>

      <view style="display: flex;margin-top: 15px;justify-content: space-between;align-items: center;">
        <view
          @click="submit"
          style="padding: 30rpx 110rpx; margin-left: 20rpx;margin-top: 20rpx; background-color: rgba(30, 94, 255, 1);border-radius: 30rpx;color: #FFFFFF;"
        >
          提交审核
        </view>
        <view
          @click="save"
          style="padding: 30rpx 110rpx;margin-left: 20rpx;margin-top: 20rpx;border-radius: 30rpx;background-color: rgba(255, 173, 4, 1); color: #FFFFFF;"
        >
          保存
        </view>
      </view>
    </view>
    <uni-popup
      ref="submitFlag"
      background-color="#fff"
      :mask-click="false"
    >
      <view style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
        <view>
          <view class="submit-item">
            <image
              class="submit-icon"
              src="@/static/duihaoblue.png"
            />
          </view>
          <view style="margin-top: 28rpx;">
            <text class="submit-text">待入职申请已经提交</text>
          </view>
          <view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx;">
            <text>已提醒审核人员进行审核</text>
          </view>
          <button
            @click="sureOne"
            style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
					color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;"
          >确定</button>
        </view>
      </view>
    </uni-popup>
    <uni-popup
      ref="draftsFlag"
      background-color="#fff"
      :mask-click="false"
    >
      <view>
        <view style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
          <view class="submit-item">
            <image
              class="submit-icon"
              src="@/static/drafts.png"
            />
          </view>
          <view style="margin-top: 28rpx;">
            <text class="submit-text">已保存进草稿箱</text>
          </view>
          <view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx;">
            <text>您可以进入草稿箱查看</text>
          </view>
          <button
            @click="sureThree"
            style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
				color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;"
          >确定</button>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
import myDate from '@/components/my-componets/my-date.vue'
import mySelect from '@/components/my-componets/my-select.vue'
import configService from '@/common/service/config.service.js'
import {
  log
} from '../../../../plugin/uni-simple-router/helpers/warn'
import moment from 'moment'
import {
  getInfoByIdCardFun
} from '@/common/util/index.js'
export default {
  data () {
    return {
	  isReloadPartData:true,
      dictOptions: [],
      sex_dictText: '',
      isEdit: 2,
      index: -1,
      indexSelect: -1,
      imgList: [],
      loading: false,
      uploadUrl: "/sys/common/upload",
      createTime: moment().format('YYYY-MM-DD'),
      birthday: '',
      idCardValidPeriod: '',
      submitFlag: false,
      draftsFlag: false,
      dataObj: {
        id: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
        avatar: '',
        createTime: moment().format('YYYY-MM-DD'),
        realname: '',
        sex: '',
        sex_dictText: '',
        age: '',
        nation: '',
        idCard: '',
        birthday: '',
        idCardAddress: '',
        idCardIssue: '',
        idCardValidPeriod: '',
        identityCategory: '',
        company: '',
        companyAddress: '',
        approvalStatus: '1'
      }
    }
  },
  create () {

  },
  mounted () {
    // this.dataObj.company = JSON.parse(localStorage.getItem('login_user_info')).data.company
    // if (this.$route.query.params) {
    // 	this.dataObj = JSON.parse(decodeURIComponent(this.$route.query.params))
    // }
  },
  onLoad (option) {
    this.initDictData()
    if (option.isEdit && option.isEdit == 1) {
      this.isEdit = 1
      this.dataObj = JSON.parse(decodeURIComponent(option.params))
      this.idCardValidPeriod = this.dataObj.idCardValidPeriod
      this.birthday = this.dataObj.birthday
      console.log('this.dataObj-edit', this.dataObj)
	  if(this.dataObj.idCardPhoto) {
	  	this.imgList = [this.getFileAccessHttpUrl(this.dataObj.idCardPhoto)]
	  }
    } else {
      this.isEdit = 2
      this.dataObj = {
        // id: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
        avatar: '',
        idCardPhoto: '',
        createTime: moment().format('YYYY-MM-DD'),
        realname: '',
        sex: '',
        sex_dictText: '',
        age: '',
        nation: '',
        idCard: '',
        birthday: '',
        idCardAddress: '',
        idCardIssue: '',
        idCardValidPeriod: '',
        identityCategory: '',
        company: '',
        companyAddress: '',
        approvalStatus: '1'
      }
    }

  },
  watch: {
    'dataObj.company': {
      immediate: true,
      handler (val, old) {
		  console.log('vvvv',val)
        if (val != '' && val) {
          this.$http.get('/crm_company/crmCompany/list')
            .then(res => {
				console.log('res-handle',res)
				if(res.data.success){
					let addressObj = res.data.result.records.filter((item) => {
					  return item.id == val
					})
					this.dataObj.companyAddress = addressObj[0].address
					this.$set(this.dataObj,'companyAddress',addressObj[0].address)
					this.reloadPart()
					console.log('this.dataObj.companyAddress',this.dataObj.companyAddress)
					
				}
            }).catch(() => {
              this.$tip.loaded();
              this.$tip.toast('提交失败122')
            });
        }
      },
    },
  },
  methods: {
	  getFileAccessHttpUrl(avatar, subStr) {
	  	if (!subStr) subStr = 'http'
	  	if (avatar && avatar.startsWith(subStr)) {
	  		return avatar;
	  	} else {
	  		return configService.staticDomainURL + "/" + avatar;
	  	}
	  },
	reloadPart(){
		this.isReloadPartData = false
		this.$nextTick(()=>{
			this.isReloadPartData = true
		})
	},
    getOtherMessage () {
		if(!this.dataObj.idCard){
			this.dataObj = {}
			this.birthday = ''
			this.reloadPart()
			return
		}
		let idCardNew = this.dataObj.idCard
		let param = {
			idCard:this.dataObj.idCard
		}
	  this.$http.get('/crm_pending_employment_application/crmPendingEmploymentApplication/queryIdentityCategory',{params:param}).then(res=>{
		  console.log('身份验证',res)
		  if (res.data.success) {
			  this.dataObj = res.data.result
			  if(!res.data.result.id && !res.data.result.blacklistType){
				 this.dataObj.idCard = idCardNew
				 const newObj = getInfoByIdCardFun(this.dataObj.idCard)
				 console.log('获取到的身份证信息', newObj)
				 this.dataObj.birthday = this.birthday = newObj.birthday
				 this.dataObj.age = newObj.age
				 this.dataObj.sex = newObj.sex
				 this.dataObj.sex_dictText = newObj.sex == 2 ? '女' : '男'
				 this.$set(this.dataObj, 'sex', newObj.sex)
				 this.$set(this.dataObj, 'sex_dictText', newObj.sex == 2 ? '女' : '男')
				 this.sex_dictText = newObj.sex == 2 ? '女' : '男'
				 this.dataObj.company = '1754477887087374337'
			  } else {
				  if(!this.dataObj.idCard) {
					  this.dataObj.idCard = idCardNew
				  }
				   const newObj = getInfoByIdCardFun(this.dataObj.idCard)
				  if(!this.dataObj.birthday) {
					this.dataObj.birthday = this.birthday = newObj.birthday
				  } else {
					  this.birthday = this.dataObj.birthday 
				  }
				  if(!this.dataObj.age) {
					   this.dataObj.age = newObj.age
				  }
				  if(!this.dataObj.sex_dictText) {
					  this.dataObj.sex = newObj.sex
					  this.dataObj.sex_dictText = newObj.sex == 2 ? '女' : '男'
					  this.$set(this.dataObj, 'sex', newObj.sex)
					  this.$set(this.dataObj, 'sex_dictText', newObj.sex == 2 ? '女' : '男')
				  }
				   console.log('this.dataObj22', this.dataObj)
				   this.reloadPart()
			  }
		  }
	  })
	  
	
     
     
    },
    PickerChange (e) {
      let index = e.detail.value
      this.indexSelect = e.detail.value
      if (index == -1) {
        this.dataObj.sex_dictText = ''
        this.dataObj.sex = ''
      } else {
        this.dataObj.sex_dictText = this.dictOptions[index].text
        this.dataObj.sex = this.dictOptions[index].value
      }
      console.log('index', index, this.dataObj)
    },
    initDictData () {
      //根据字典Code, 初始化字典数组
      let code = 'sex';
      this.$http.get(`/sys/dict/getDictItems/${code}`).then(res => {
        console.log('获取性别', res)
        if (res.data.success) {
          this.dictOptions = res.data.result;
        }
      })

    },
    getIndex () {
      for (var i = 0; i < this.dictOptions.length; i++) {
        if (this.dictOptions[i].value == this.value) {
          this.index = i
          return
        }
      }
      this.index = -1
    },
    DateChangeIdCardValidPeriod (e) {
      this.idCardValidPeriod = e.detail.value
      this.dataObj.idCardValidPeriod = e.detail.value
    },
    DateChange (e) {
      this.birthday = e.detail.value
      this.dataObj.birthday = e.detail.value
    },
    DateChangeCreateTime (e) {
      this.createTime = e.detail.value
      this.dataObj.createTime = e.detail.value
    },

    ChooseImage () {
      if (this.isEdit !== 1) {
        var that = this;
        uni.chooseImage({
          count: 1, //默认9
          sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
          sourceType: ['album'], //从相册选择
          success: (res) => {
            console.log(that.uploadUrl)
            console.log(that.$config.apiUrl)
            that.$http.upload(that.$config.apiUrl + that.uploadUrl, {
              filePath: res.tempFilePaths[0],
              name: 'file'
            })
              .then(res => {
                that.dataObj.idCardPhoto = res.data.message;
              })
              .catch(err => {
                that.$tip.error(err.data.message)
              });
            this.imgList = res.tempFilePaths
          }
        });
      }

    },
    ViewImage (e) {
      uni.previewImage({
        urls: this.imgList,
        current: e.currentTarget.dataset.url
      });
    },
    DelImg (e) {
      uni.showModal({
        title: '提示',
        content: '确定要删除吗？',
        cancelText: '取消',
        confirmText: '确定',
        success: res => {
          if (res.confirm) {
            this.imgList.splice(e.currentTarget.dataset.index, 1)
          }
        }
      })
    },
    submit () {
      this.dataObj.approvalStatus = '2'
	  
      this.dataObj.createTime = this.dataObj.createTime ? this.dataObj.createTime + " 00:00:00" : moment().format('YYYY-MM-DD') + " 00:00:00"
      if (this.isEdit == 1) {
        console.log('this.dataObj-edit', this.dataObj)
        // 编辑
        this.$http.put('/crm_pending_employment_application/crmPendingEmploymentApplication/edit', {
          "id": this.dataObj.id,
          "company": this.dataObj.company,
          "companyAddress": this.dataObj.companyAddress,
          "idCardAddress": this.dataObj.idCardAddress,
          "nativePlace": this.dataObj.nativePlace,
          "approvalStatus": this.dataObj.approvalStatus,
          "createTime": this.dataObj.createTime,
		   "blacklistType":this.dataObj.blacklistType
        })
          .then(res => {
            console.log('编辑', res)
            if (res.data.success) {
              this.$http.post(
                '/crm_pending_employment_application/crmPendingEmploymentApplication/submitTrial/' +
                this.dataObj.id)
                .then(res => {
                  if (res.data.success) {
                    this.$refs.submitFlag.open('center')
                  } else {
                    this.$tip.toast('提交审核失败')
                  }
                }).catch(() => {
                  this.$tip.loaded();
                  this.$tip.toast('提交审核失败')
                });
            } else {
              this.$tip.toast(res.data.message)
            }
          }).catch(() => {
            this.$tip.loaded();
            this.$tip.toast('提交失败')
          });
      } else {
        // 新增
        console.log('this.dataObj', this.dataObj)
        this.dataObj.id = Math.floor(Math.random() * 10000000000000000000) + Date.now()
        this.$http.post('/crm_pending_employment_application/crmPendingEmploymentApplication/add', this
          .dataObj)
          .then(res => {
            console.log('add-res', res)
            if (res.data.success) {
              this.$http.post(
                '/crm_pending_employment_application/crmPendingEmploymentApplication/submitTrial/' +
                this.dataObj.id)
                .then(res => {
                  console.log('add-trial-res', res)
                  if (res.data.success) {
                    this.$refs.submitFlag.open('center')
                  } else {
                    this.$tip.toast('提交审核失败')
                  }
                }).catch(() => {
                  this.$tip.loaded();
                  this.$tip.toast('提交审核失败')
                });
            } else {
              this.$tip.toast(res.data.message)
            }
          }).catch(() => {
            this.$tip.loaded();
            this.$tip.toast('提交失败')
          });
      }


    },
    save () {
      this.dataObj.approvalStatus = '1'
      this.dataObj.createTime = this.dataObj.createTime ? this.dataObj.createTime + " 00:00:00" : moment().format('YYYY-MM-DD') + " 00:00:00"
      console.log('this.dataaaa', this.dataObj)

      if (this.isEdit == 1) {
        this.$http.put('/crm_pending_employment_application/crmPendingEmploymentApplication/edit', {
		 "approvalStatus":'1',
          "id": this.dataObj.id,
          "company": this.dataObj.company,
          "companyAddress": this.dataObj.companyAddress,
          "idCardAddress": this.dataObj.idCardAddress,
          "nativePlace": this.dataObj.nativePlace,
          "approvalStatus": this.dataObj.approvalStatus,
          "createTime": this.dataObj.createTime,
		  "blacklistType":this.dataObj.blacklistType
        })
          .then(res => {
            console.log('res-save', res)
            if (res.data.success) {
              this.$refs.draftsFlag.open('center')
            } else {
              this.$tip.toast(res.data.message)
            }
          }).catch(() => {
            this.$tip.loaded();
            this.$tip.toast('提交失败')
          });
      } else {
        this.$http.post('/crm_pending_employment_application/crmPendingEmploymentApplication/add', this
          .dataObj)
          .then(res => {
            console.log('res-save', res)
            if (res.data.success) {
              this.$refs.draftsFlag.open('center')
            } else {
              this.$tip.toast(res.data.message)
            }
          }).catch(() => {
            this.$tip.loaded();
            this.$tip.toast('提交失败')
          });
      }

    },
    submitTrial () {
      // 提交审核
      this.$http.post(
        '/crm_pending_employment_application/crmPendingEmploymentApplication/submitTrial/' +
        this.dataObj.id)
        .then(res => {
          if (res.data.success) {
            this.$tip.toast('提交成功')
          } else {
            this.$tip.toast(res.data.message)
          }
        }).catch(() => {
          this.$tip.loaded();
          this.$tip.toast('提交失败')
        });
    },
    addImg () {

    },
    sureOne () {
      this.$refs.submitFlag.close()
      uni.navigateTo({
        url: '/pages/oa/crm_employment_pending/index'
      })
    },
    sureThree () {
      this.$refs.draftsFlag.close()
      uni.navigateTo({
        url: '/pages/oa/crm_employment_pending/drafts/index'
      })
    }
  }
}
</script>

<style>
.cu-form-group {
  background-color: #ffffff;
  padding: 0.5px 0;
  display: flex;
  align-items: center;
  min-height: 52px;
  justify-content: space-between;
}

.cu-form-group uni-picker .picker {
  line-height: 15px;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;
  text-align: right;
}

.cu-form-group uni-picker::after {
  font-family: cuIcon;
  line-height: 15px;
  display: block;
  content: "\e6a3";
  position: absolute;
  font-size: 12px;
  color: #8799a3;
  width: 31px;
  text-align: center;
  top: 0;
  bottom: 0;
  right: -10rpx;
  margin: auto;
}

.grid.grid-square > uni-view > uni-text[class*="cuIcon-"] {
  font-size: 27px;
  position: absolute;
  color: #8799a3;
  margin: auto;
  top: -10px;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.addImgStyle {
  background: rgba(255, 255, 255, 0.63) !important;
  border-radius: 6px 0px 7px 0px;
  position: absolute;
  left: 0;
  width: 25px;
  height: 15px;
  font-size: 10px;
}

.submit-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2100rpx;
  background-color: rgba(3, 3, 3, 0.28);
  z-index: 10000;
}

.submit-box {
  padding: 11rpx;
  width: 580rpx;
  height: 470rpx;
  border-radius: 42rpx;
  position: absolute;
  right: 86rpx;
  background-color: #ffffff;
  margin-top: 888rpx;
  text-align: center;
}

.submit-item {
}

.submit-text {
  font-size: 32rpx;
}

.submit-icon {
  width: 118rpx;
  height: 118rpx;
  margin-top: 58rpx;
}

input {
  text-align: right;
}
</style>